<!DOCTYPE html>
<html>

<head>
    <title>车辆列表</title>
    <script src="../../statics/js/modules/car/tcarbasic.js"></script>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="Author" content="larry" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../../statics/common/cascader/cascader/cascader.css" media="all">
    <link rel="stylesheet" type="text/css" href="../../statics/common/layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="../../statics/common/layui/css/autocomplete.css">
    <link rel="stylesheet" type="text/css" href="../../statics/common/layui/css/soulTable.css">
    <link rel="stylesheet" type="text/css" href="../../statics/plugins/ztree/css/metroStyle/metroStyle.css">
    <link rel="stylesheet" type="text/css" href="../../statics/css/common.css">
    <link rel="stylesheet" type="text/css" href="../../statics/css/font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="../../statics/css/list-search-table.css">
    <!--<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/layui-soul-table/docs/soulTable.css" media="all"/>-->
    <script type="text/javascript" src="../../statics/plugins/jquery.min.js"></script>
    <script type="text/javascript" src="../../statics/common/lib/vue.min.js"></script>
    <script type="text/javascript" src="../../statics/plugins/ztree/jquery.ztree.all.min.js"></script>
    <script type="text/javascript" src="../../statics/common/layui/layui.all.js"></script>
    <script type="text/javascript" src="../../statics/common/js/axios.min.js"></script>
    <script type="text/javascript" src="../../statics/common/js/xm-select.js"></script>
    <script type="text/javascript" src="../../statics/js/common.js"></script>
    <script type="text/javascript" src="../../statics/js/upload.js"></script>
    <script type="text/javascript" src="../../statics/common/step/steps.js"></script>
    <link rel="stylesheet" href="../../statics/css/jxcPublicAll.css" media="all">
    <link href="../../statics/common/photoviewer/dist/photoviewer.css" rel="stylesheet">
    <link rel="stylesheet" href="../../statics/common/step/steps.css">
    <!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.7/cropper.css" media="all">-->
    <link rel="stylesheet" href="../../statics/js/modules/cropper/cropper.css" media="all">
    <link rel="stylesheet" type="text/css" href="../../statics/css/viewer.min.css">
    <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.7/cropper.min.js"></script>-->
    <script src="../../statics/js/modules/cropper/cropper.min.js"></script>
    <script src="../../statics/common/photoviewer/dist/photoviewer.js"></script>
    <script src="../../statics/common/layui/autocomplete.js"></script>
    <script src="../../statics/js/modules/viewer/viewer.min.js"></script>
    <script src="../../statics/common/print-js/print.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../../statics/common/print-js/print.min.css">
    <script type="text/javascript" src="../../statics/common/xmselect/xm-select.js"></script>
    <script type="text/javascript" src="../../statics/js/searchview.js"></script>
    <script type="text/javascript" src="../../statics/js/tableedit.js"></script>

    <!--<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.0&type=webgl&ak=eo4XeZhRKHsQ0NOe6u6NkKscmRsk416B"></script>-->

    <!-- 引入组件库 -->
    <link rel="stylesheet" type="text/css" href="../../statics/css/index.css">
    <style>
        .layui-form-item .layui-inline {
            display: flex;
        }

        #rrapp xm-select {
            width: 187px;
            min-height: 30px;
            line-height: 30px;
        }

        #rrapp xm-select .label-content {
            font-size: 12px;
        }

        #rrapp .list-header-card>div {
            padding: 5px 0;
        }

        #rrapp .list-header-sub-card>div {
            padding: 3px 10px;
        }

        #rrapp .list-header-sub-card-text,
        #rrapp .list-header-card-text {
            margin: 0;
        }
    </style>
</head>

<body class="ren-body">
    <div id="rrapp" v-cloak>
        <div class="list-header-content-box">
            <div class="list-header-card display">
                <div v-for="(item, index) in statusCar" :key="index" class="flex"
                    :class="index === statusCarIndex ? 'active' : ''" @click="changeStatus(item,index)"
                    style="cursor:pointer;">
                    <span><i @mouseout.stop="mouseout" @mousemove="move(index)" class="layui-icon layui-icon-about"
                            :id="index"></i></span>
                    <div class="list-header-card-text">{{item.name}}</div>
                    <div class="list-header-card-number">{{item.carNum}}</div>
                </div>
            </div>
            <div class="list-header-sub-wrap">
                <span class="fm-list-header-laber">车辆状态</span>
                <div class="list-header-sub-card">
                    <div v-for="(item, index) in typeCar" :key="index" @click="changeType(item,index)"
                        :class="index === typeCarIndex ? 'active' : ''" style="cursor:pointer;">
                        <div class="list-header-sub-card-text">{{item.name}}</div>
                        <div class="list-header-sub-card-number">{{item.carNum}}</div>
                    </div>
                </div>
            </div>

            <div class="list-header-sub-wrap">
                <span class="fm-list-header-laber">订单状态</span>
                <div class="list-header-sub-card">
                    <div v-for="(item, index) in typeCar2" :key="index" @click="changeType2(item,index)"
                        :class="index === typeCarIndex1 ? 'active' : ''" style="cursor:pointer;">
                        <div class="list-header-sub-card-text">{{item.name}}</div>
                        <div class="list-header-sub-card-number">{{item.carNum}}</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="list-search-title-box">
            <form class="layui-form" style="box-shadow: 0 0 20px #eee;padding-right: 15px;">
                <section class="jxc-section" style="display: flex;align-items: flex-start;white-space: nowrap;">
                    <div class="card layui-row" style="flex: 1">
                        <div class="layui-form-item ">
                            <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                <label class="layui-form-label">品牌/车系/车型</label>
                                <div class="layui-input-inline">
                                    <input type="text" id="a" class="layui-input" placeholder="请选择品牌/车系/车型"
                                        readonly="readonly" />
                                </div>
                            </div>
                            <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                <label class="layui-form-label">车牌号/车架号</label>
                                <div class="layui-input-inline">
                                    <input type="text" class="layui-input searchVal" v-model="q.keyword"
                                        placeholder="请输入车牌号/车架号" />
                                </div>
                            </div>
                            <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                <label class="layui-form-label">车辆归属</label>
                                <div class="layui-input-inline">
                                    <input type="text" class="layui-input searchVal" style="cursor:pointer;"
                                           @click="deptTree(1)" v-model="q.deptNameListStr" readonly placeholder="请选择车辆归属" />
                                </div>
                            </div>
                            <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                <label class="layui-form-label"> </label>
                                <div style="display: flex;align-items: center;">
                                    <!-- #2251C5 -->
                                    <a class="layui-btn search-btn" @click="query">查询</a>
                                    <a class="layui-btn reset-btn" @click="reset">重置</a>
                                    <div @click="bindFilter"
                                        style="margin-left: 10px;cursor: pointer;user-select: none;">
                                        <span style="color: #2251C5;">高级筛选</span>
                                        <img src="../../../statics/images/高级筛选@2x.png" style="width:14px">
                                        <!-- <i class="layui-icon" :class="isFilter?'layui-icon-up':'layui-icon-down'"
                                            data-cascader="icon"></i> -->
                                    </div>
                                </div>
                            </div>
                            <section v-show="isFilter">
                                <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                    <label class="layui-form-label">供应商</label>
                                    <div class="layui-input-inline">
                                        <input type="text" class="layui-input searchVal"
                                            v-model="q.purchaseSupplierName" placeholder="请输入供应商" />
                                    </div>
                                </div>

                                <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                    <label class="layui-form-label">发动机号</label>
                                    <div class="layui-input-inline">
                                        <input type="text" class="layui-input searchVal" v-model="q.engineNo"
                                            placeholder="请输入发动机号" />
                                    </div>
                                </div>
                                <div class="layui-inline layui-col-md4 layui-col-sm6 layui-col-xs12">
                                    <label class="layui-form-label">车辆来源</label>
                                    <div class="layui-input-inline">
                                        <select lay-filter="sourceType" v-model="q.sourceType">
                                            <option value="">请选择车辆来源</option>
                                            <option value=1>直购</option>
                                            <option value=2>经租</option>
                                            <option value=3>以租代购</option>
                                            <option value=4>挂靠车</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                    <label class="layui-form-label">车辆类型</label>
                                    <div class="layui-input-inline">
                                        <input type="text" class="layui-input searchVal" v-model="q.carType"
                                            placeholder="请输入车辆类型" />
                                    </div>
                                </div>
                                <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                    <label class="layui-form-label">车辆所有人</label>
                                    <div class="layui-input-inline">
                                        <input type="text" class="layui-input searchVal" v-model="q.carOwner"
                                            placeholder="请输入车辆所有人" />
                                    </div>
                                </div>
                                <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                    <label class="layui-form-label">备注信息</label>
                                    <div class="layui-input-inline">
                                        <input type="text" class="layui-input searchVal" v-model="q.remark"
                                            placeholder="请输入备注信息" />
                                    </div>
                                </div>
                                <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                    <label class="layui-form-label">动力类型:</label>
                                    <div class="layui-input-inline">
                                        <select lay-filter="carPowerSelect" v-model="q.carPower">
                                            <option value="">请选择动力类型</option>
                                            <option v-for="item in carPowerData" :value="item.code">{{item.value}}
                                            </option>
                                        </select>
                                    </div>
                                </div>
                                <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                    <label class="layui-form-label">车辆状态</label>
                                    <div class="layui-input-inline">
                                        <select name="vehicleStatus" lay-filter="vehicleStatusSelect"
                                            v-model="q.vehicleStatus">
                                            <option value="">请选择车辆状态</option>
                                            <option value="1">整备中</option>
                                            <option value="2">备发车</option>
                                            <option value="3">预定中</option>
                                            <option value="4">用车中</option>
                                            <option value="5">已过户</option>
                                            <option value="6">已处置</option>
                                            <option value="7">已出售</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="layui-inline layui-col-md3 layui-col-sm6 layui-col-xs12">
                                    <label class="layui-form-label">车辆仓库</label>
                                    <div class="layui-input-inline" id="selectDepot"></div>
                                </div>

                                <div class="flex-box layui-inline layui-col-md12 layui-col-sm12 layui-col-xs12">
                                    <label class="layui-form-label">入库时间:</label>
                                    <div class="list-search-sup-title new-layui-title">
                                        <div class="task-content-box-tab">
                                            <div class="display task-content-box-tab layui-col-md8 layui-col-sm8 layui-col-xs12"
                                                type="updateTimeType">
                                                <div value="0" class="layui-col-md2 layui-col-sm2 layui-col-xs2">昨天
                                                </div>
                                                <div value="1" class="layui-col-md2 layui-col-sm2 layui-col-xs2">今天
                                                </div>
                                                <div value="2" class="layui-col-md2 layui-col-sm2 layui-col-xs2">上周
                                                </div>
                                                <div value="3" class="layui-col-md2 layui-col-sm2 layui-col-xs2">本周
                                                </div>
                                                <div value="4" class="layui-col-md2 layui-col-sm2 layui-col-xs2">上月
                                                </div>
                                                <div value="5" class="layui-col-md2 layui-col-sm2 layui-col-xs2">本月
                                                </div>
                                                <div value="6" class="layui-col-md2 layui-col-sm2 layui-col-xs2">本季
                                                </div>
                                                <div value="7" class="layui-col-md2 layui-col-sm2 layui-col-xs2">本年
                                                </div>
                                            </div>
                                            <div class="layui-col-md3 layui-col-sm4 layui-col-xs12">
                                                <input type="text" class="layui-input" id="updateTimeStr"
                                                    v-model="q.updateTimeStr" readonly placeholder="选择日期范围"
                                                    style="width: 300px;" autocomplete="off">
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </section>
                        </div>
                    </div>
                    <div style="display: flex;align-items: center;" v-if="false">
                        <!-- #2251C5 -->
                        <a class="layui-btn search-btn" @click="query">查询</a>
                        <a class="layui-btn reset-btn" @click="reset">重置</a>
                        <div @click="bindFilter" style="margin-left: 10px;cursor: pointer;user-select: none;">
                            <span style="color: #2251C5;">高级筛选</span>
                            <img src="../../../statics/images/高级筛选@2x.png" style="width:14px">
                            <!-- <i class="layui-icon" :class="isFilter?'layui-icon-up':'layui-icon-down'"
                                data-cascader="icon"></i> -->
                        </div>
                    </div>
                </section>
            </form>
        </div>
        <div class="list-search-title-box">
            <form class="layui-form">
                <div style="display:flex;width: 100%;">
                    <div class="layui-form-item layui-row" style="width: 100%;">
                        <div class="list-search-form-button" style="width: 100%;">
                            <a class="layui-btn search-btn" @click="add" v-m-perm="['car:tcarbasic:save']">新增车辆</a>
                            <a class="layui-btn export-btn" @click="updatermark">备注</a>
                            <a class="layui-btn export-btn" @click="vehicleCard">车辆换牌</a>
                            <a class="layui-btn export-btn" id="vehicleTrack" @click="vehicleTrack">车辆轨迹</a>
                            <a class="layui-btn export-btn" @click="exp">导出</a>
                            <a class="layui-btn export-btn" style="margin-left: 10px;" @click="expAll"
                                v-m-perm="['car:tcarbasic:expall']">汇总导出</a>
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="layui-tab-item layui-show">
            <div v-if="false"
                style="float:left; width: 180px; height: 300px; padding: 10px; border: 1px solid #ddd; overflow: auto;background-color: #e6eefd;">
                <ul id="demo1"></ul>
            </div>
            <div>
                <table class="layui-hide" id="grid" lay-filter="grid"></table>
            </div>
        </div>
    </div>


    <!--操作-->
    <style>
        .mmv-dropdonw {
            display: inline-block;
        }

        .mmv-dropdonw .mmv-dropdonw-wrap {
            display: none;
            position: fixed;
            z-index: 100;
            box-shadow: 0 0 5px #ddd;
        }

        .mmv-dropdonw .mmv-dropdonw-wrap .mmv-drop-donw-item {
            background-color: #fff;
            padding: 0 10px;
        }

        .layui-table-cell,
        .layui-table-tool-panel li {
            overflow: initial !important;
        }
    </style>
    <script type="text/html" id="barTpl">
<!--	<#if shiro.hasPermission("car:tcarbasic:update")>-->
    <!--	{{#if (d.businessType != 5 && d.businessType != 7 ){ }}-->
    <!--	 <a class="layui-grid-btn-xs" lay-event="edit">编辑</a>-->
    <!--	{{#} }}-->
    <!--	</#if>-->
    <!--	 <a class="layui-grid-btn-xs" lay-event="details">详情</a>-->
    <!--	<a class="layui-grid-btn-xs" lay-event="detailsOrEdit">编辑详情</a>-->
    <!--	&lt;!&ndash; 用车中的车辆加修改备注功能 &ndash;&gt;-->
    <!--	<#if shiro.hasPermission("car:tcarbasic:updatermark")>-->
    <!--	{{# if(d.businessType ==4){ }}-->
    <!--		{{# if(d.collect){ }}-->
    <!--			<a class="layui-grid-btn-xs" lay-event="collect">强制收车</a>-->
    <!--		{{#}}}-->
    <!--	{{#}}}-->
    <!--	</#if>-->

    <!--	{{# if(d.businessType == 6 && d.approveStatus == 3){ }}-->
    <!--	<a class="layui-grid-btn-xs" lay-event="cancelDisposal">撤销处置</a>-->
    <!--	{{#}}}-->
    <!--	&lt;!&ndash;当前状态 1整备中，2备发车，3 预定中  4.用车中 5.已过户&ndash;&gt;-->
    <!--	<#if shiro.hasPermission("inoutrecords:inourecords:save")>-->
    <!--	{{# if(d.businessType ==1|| d.businessType ==2 || d.businessType ==3){ }}-->
    <!--	  <a class="layui-grid-btn-xs" lay-event="transfer">移库</a>-->
    <!--	{{#}}}-->
    <!--	</#if>-->
    <!--	{{# if(d.businessType ==1|| d.businessType ==2){ }}-->
    <!--		<a class="layui-grid-btn-xs" lay-event="disposal">处置</a>-->
    <!--	{{#}}}-->
    <!--	{{# if(d.noticeType == 13){ }}-->
    <!--		<a class="layui-grid-btn-xs" lay-event="notice">通知</a>-->
    <!--	{{#}}}-->

    <div class="mmv-dropdonw">
        <a class="layui-grid-btn-xs" lay-event="detailsOrEdit">详情</a>
        <a class="mmv-dropdonw-btn layui-grid-btn-xs" lay-event="mmvMore">更多<i class="el-icon-d-arrow-right"></i></a>
        <div class="mmv-dropdonw-wrap">
            <div class="mmv-drop-donw-item">
            </div>
            <!-- 用车中的车辆加修改备注功能 -->
            <!--            <#if shiro.hasPermission("car:tcarbasic:updatermark")>-->
            {{# if(d.businessType ==4){ }}
            {{# if(d.collect){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="collect" v-m-perm="['car:tcarbasic:forcelyCar']">强制收车</a>
            </div>
            {{#}}}
            {{#}}}
            <!--            </#if>-->

            {{# if(d.businessType == 6 && d.approveStatus == 3){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="cancelDisposal">撤销处置</a>
            </div>
            {{#}}}
            <!--当前状态 1整备中，2备发车，3 预定中  4.用车中 5.已过户-->
            <!--            <#if shiro.hasPermission("inoutrecords:inourecords:save")>-->
            {{# if(d.businessType ==1|| d.businessType ==2 || d.businessType ==3){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="transfer" v-m-perm="['inoutrecords:inourecords:save']">移库</a>
            </div>
            {{#}}}
            <!--            </#if>-->
            {{# if((d.businessType ==1 && d.ifChuZhi==1)|| (d.businessType ==2 && d.ifChuZhi==1)){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="disposal">处置</a>
            </div>
            {{#}}}
            {{# if(d.noticeType == 13){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="notice">通知</a>
            </div>
            {{#}}}
            {{# if(d.illegalDate !=null){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="solveIllegal">违章查询</a>
            </div>
            {{#}}}
            {{# if(d.ifBaoYang ==0){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="addBaoYang">新建保养</a>
            </div>
            {{#}}}
            {{# if(d.ifYearCheck ==0){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="addYearCheck">新建年检</a>
            </div>
            {{#}}}
            {{# if(d.ifInsurance ==0){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="xuBao">续保单</a>
            </div>
            {{#}}}

            {{# if(d.ifXuZu ==0){ }}
            <div class="mmv-drop-donw-item">
                <a class="layui-grid-btn-xs" lay-event="xuZu">续租</a>
            </div>
            {{#}}}


        </div>
    </div>
    </script>

    <script src="../../statics/js/modules/car/tcarbasic.js"></script>

</body>

</html>